<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/js/jquery-1.7.2.min.js"></script><!--就用元素状态的，不然会加载不了js-->
    <script src="/layui/layui.all.js"></script>
    <link rel="stylesheet" href="/layui/css/layui.css">
</head>
<body>
<table class="layui-hide" id="test" lay-filter="test"></table>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="order">预定</a>
    <a class="layui-btn layui-btn-xs" lay-event="insert">添加</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
</script>
<script>
    layui.use('table', function() {
        var table = layui.table;
        var layer = layui.layer;

        table.render({
            elem: '#test'
            , url: '/client/user/findall'
            , title: '菜单列表'
            , cols: [
                [
                    {field: 'id', width: 100, title: '编号', sort: true}
                    , {field: 'username', width: 200, title: '用户名'}
                    , {field: 'password', width: 100, title: '单价'}
                    , {field: 'nickname', width: 100, title: '昵称'}
                    , {field: 'gender', width: 100, title: '性别'}
                    , {field: 'telephone', width: 200, title: '手机'}
                    , {field: 'registerdate', width: 200, title: '注册时间'}
                    , {field: 'address', width: 100, title: '地址'}


                    , {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 250}
                ] /*要分开着两个中括号*/
            ]
            , page: true
        });
    });


</script>
</body>
</html>